import 'package:flutter/material.dart';

class ContainerButtonDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final Widget _outlineButtonDemo = Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        //OutlineButton的宽高由Container容器决定
        //Expanded 则是铺满整个横屏空间
        Expanded(
//          width: 200.0,
          child: OutlineButton(
            child: Text('ContainerButtonDemo'),
            onPressed: () {
              debugPrint('ContainerButtonDemo is onPressed');
            },
            //渐变效果
            splashColor: Colors.grey,
            textColor: Colors.black,
            borderSide: BorderSide(
              color: Colors.black,
            ),
            highlightedBorderColor: Colors.grey,
          ),
        ),

        SizedBox(
          width: 32.0,
        ),
        //等分水平方向空间
        Expanded(
//          width: 200.0,
        //按照比例分配空间
        flex: 2,
          child: OutlineButton(
            child: Text('ContainerButtonDemo'),
            onPressed: () {
              debugPrint('ContainerButtonDemo is onPressed');
            },
            //渐变效果
            splashColor: Colors.grey,
            textColor: Colors.black,
            borderSide: BorderSide(
              color: Colors.black,
            ),
            highlightedBorderColor: Colors.grey,
          ),
        ),
      ],
    );

    return Scaffold(
      appBar: AppBar(
        title: Text('ContainerButtonDemo'),
        elevation: 0.0,
      ),
      body: Container(
        padding: EdgeInsets.all(8.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            _outlineButtonDemo,
          ],
        ),
      ),
    );
  }
}
